<template>
	<div class="box">
		<div class="content-title">
			<div class="back" @click="$router.back('./')"><img src="../../assets/img/back.png" /><span>返回</span></div>
			<div class="title-name">{{title_name}}
			({{title_name=='投递人数'?data.deliverPeople:title_name=='邀约人数'?data.invitePeople:title_name=='待面试人数'?
			data.interviewPeople:title_name=='面试未通过人数'?data.failedInterviewPeople:title_name=='已录用人数'?data.acceptedPeople:title_name=='满保障期人数'?data.guaranteePeople:''}})
			</div>
		</div>
		<div class="content-tab">
			<el-table @cell-click="handle" :data="tableData" style="width: 100%;">
				<el-table-column prop="nickname" label="会员名称" width="180"></el-table-column>
				<el-table-column prop="name" label="真实姓名" width="180"></el-table-column>
				<el-table-column prop="telnum" label="手机号码" width="180"></el-table-column>
				<el-table-column prop="createTime" label="注册时间" width="190"></el-table-column>
				<el-table-column prop="area" label="居住地" width="190"></el-table-column>
				<el-table-column prop="Sex" label="性别" width="190"></el-table-column>
				<el-table-column prop="birthDay" label="出生年月" width="190"></el-table-column>
				<el-table-column prop="jobName" v-if="title_name=='投递人数'" label="投递岗位" width="170"></el-table-column>
				<el-table-column prop="jobName" v-if="title_name=='邀约人数'" label="邀约岗位" width="170"></el-table-column>
				<el-table-column prop="jobName" v-if="title_name=='待面试人数'" label="待面试岗位" width="170"></el-table-column>
				<el-table-column prop="jobName" v-if="title_name=='面试未通过人数'"  label="面试岗位" width="170"></el-table-column>
				<el-table-column prop="jobName" v-if="title_name=='已录用人数'" label="录用岗位" width="170"></el-table-column>
				<el-table-column prop="jobName" v-if="title_name=='满保障期人数'" label="满保障期岗位" width="170"></el-table-column>
				<el-table-column prop="deliverTime"  v-if="title_name=='投递人数'" label="投递时间" width="160"></el-table-column>
				<el-table-column prop="inviteTime"  v-if="title_name=='邀约人数'" label="邀约时间" width="160"></el-table-column>
				<el-table-column prop="inviteTime"  v-if="title_name=='待面试人数'" label="待面试时间" width="160"></el-table-column>
				<el-table-column prop="inviteTime"  v-if="title_name=='面试未通过人数'" label="面试未通过时间" width="160"></el-table-column>
				<el-table-column prop="inviteTime"  v-if="title_name=='已录用人数'" label="录用时间" width="160"></el-table-column>
				<el-table-column prop="inviteTime"  v-if="title_name=='满保障期人数'" label="满保障期时间" width="160"></el-table-column>
			</el-table>
		</div>
		<!-- 简历弹框 -->
		<el-dialog  :visible.sync="resshow" width="1252px">
			<div slot="title" class="header-title">
			         {{resumeInfo.name}} 的简历
			        </div>
			<div class="content">
				<div
					style="width: 190px;height: 92px;position: absolute;background-color: #A1A1A1;right: 104px;top: 0;">
				</div>
				<!-- 基本信息 -->
				<div class="content-title">
					<div class="left">
						<div>
							<p style="font-size: 16px;font-weight: bold;">基本信息</p>
							<div style="width: 100%;display: flex;">
								<div style="width: 172px;
						 height: 178px;
						 background: #FFFFFF;"><img :src="basicinfo.accessoryId" /></div>
								<div>
								</div>
							</div>
						</div>
						<div style="display: flex;flex-direction: column;margin-top: 30px;">
							<div style="margin-bottom: 25px;"><span style="font-size: 27px;
		                                   font-family: PingFang SC;
		                                   font-weight: 500;
		                                   line-height: 38px;
		                                   color: #000000;">姓名</span>
								<span style="font-size: 14px;
		                                   font-family: PingFang SC;
		                                   font-weight: 500;
		                                   line-height: 20px;
		                                   color: #000000;">({{resumeInfo.name}})</span>
							</div>
							<div><span class="th">性别:</span><span class="td">{{basicinfo.sex}}</span></div>
							<div><span class="th">年龄:</span><span class="td">{{resumeInfo.age}}</span></div>
							<div><span class="th">居住地:</span><span class="td">{{basicinfo.city}}</span></div>
							<div><span class="th">状态:</span><span class="td">{{basicinfo.jobstatus_name}}</span></div>
						</div>
					</div>
					<div class="right">
						<div style="width: 100%;margin: 95px;">
							<div><span class="th">民族:</span><span class="td">{{personal.nation}}</span></div>
							<div><span class="th">籍贯:</span><span class="td">{{personal.nativePlace}}</span></div>
							<div><span class="th">身份证号码:</span><span class="td">310227199412074415</span></div>
							<div><span class="th">手机号码:</span><span class="td">{{basicinfo.accountNumber}}</span></div>
						</div>

					</div>
				</div>
				<!-- 个人情况 -->
				<div class="content-center">
					<p
						style="font-size: 26px;font-family: PingFang SC;font-weight: bold;line-height: 37px;color: #333333;">
						个人情况</p>
					<div class="tab">
						<div>
							<div><span class="th">生肖:</span><span class="td">{{personal.animals}}</span></div>
							<div><span class="th">身高:</span><span class="td">{{personal.stature}}cm</span></div>
							<div><span class="th">体重:</span><span class="td">{{personal.kilogram}}kg</span></div>
							<div><span class="th">血型:</span><span class="td">{{personal.blood==1?'A':(personal.blood==2?'B':(personal.blood==3?'AB':'O'))}}型血</span></div>
						</div>
						<div>
							<div><span class="th">学历:</span><span class="td">{{personal.education}}</span></div>
							<div><span class="th">紧急联系人:</span><span class="td">{{personal.emergency}}</span></div>
							<div><span class="th">紧急联系人电话:</span><span class="td">{{personal.emergencyTel}}</span></div>
							<div><span class="th">社保:</span><span class="td">{{personal.socialSecurity==0?'无':'有'}}</span></div>
						</div>
						<div>
							<div><span class="th">精神病史:</span><span class="td">{{personal.psychiatric==0?'无':'有'||'无'}}</span></div>
							<div><span class="th">重大疾病史:</span><span class="td">{{personal.diseaseHistory==0?'无':'有'||'无'}}</span></div>
							<div><span class="th">失信记录:</span><span class="td">{{personal.brokenRecord==0?'无':'有'||'无'}}</span></div>
							<div><span class="th">犯罪记录:</span><span class="td">{{personal.criminalRecord==0?'无':'有'||'无'}}</span></div>
						</div>
						<div>
							<div><span class="th">打呼轻重:</span><span class="td">{{personal.snoringSeverity==0?'无':(personal.snoringSeverity==1?'轻度':'中度')}}</span></div>

						</div>

					</div>
				</div>
				<!-- 求职意向 -->
				<div class="content-center">
					<p
						style="font-size: 26px;font-family: PingFang SC;font-weight: bold;line-height: 37px;color: #333333;">
						求职意向</p>
					<div style="width: 100%; margin-left: 120px;" v-for="(item,index) in intentionList" :key="index">
						<div class="item"><span class="th">职位名称：</span><span class="td">{{item.jobName}}</span></div>
						<div  class="item"><span class="th">工作地点：</span><span class="td">{{item.intentionProvince}}-{{item.intentionCity}}-{{item.jobCounty}}</span></div>
						<div  class="item"><span class="th">期望薪资：</span><span class="td">{{item.expectedSalary}}</span></div>
					</div>
					<!-- <div style="display: flex;width: 100%;justify-content: space-evenly;">
						<div><span class="th">职位名称：</span><span class="td">保姆</span></div>
						<div><span class="th">工作地点：</span><span class="td">上海闵行区</span></div>
						<div><span class="th">期望薪资：</span><span class="td">7千-8千</span></div>
					</div> -->
				</div>
				<!-- 工作经历 -->
				<div class="experience" v-for="(item,index) in experienceList" :key="index">
					<p style="font-size: 26px;font-family: PingFang SC;font-weight: bold;line-height: 37px;color: #333333;">工作经历</p>
					<div class="experience-content" >
						<div style="display: flex;justify-content: space-around;">
							<div>
								<span class="quan"></span>
								<span
									style="font-size: 26px;font-family: PingFang SC;font-weight: 500;line-height: 37px;color: #333333;">上海发才网络信息技术有限公司</span>
							</div>
							<div style="font-size: 26px;font-family: PingFang TC;font-weight: 400;line-height: 37px;color: #A1A1A1;">
								<span>{{item.jobName}}</span><!-- <span>·</span><span>设计部</span> -->
							</div>
							<div
								style="font-size: 26px;font-family: PingFang TC;font-weight: 400;line-height: 37px;color: #A1A1A1;">
								<span>{{item.entryTime}}-{{item.dimissionTime}}</span>
							</div>
						</div>
						<div style="margin:13px 0 0 110px;width: 896px;">
							<div style="
						   width: 100%;font-size: 24px;
						   font-family: PingFang TC;
						   font-weight: 400;
						   line-height: 33px;
						   color: #333333;"><span>1、{{item.jobDescription}}</span></div>
						</div>
					</div>
				</div>
				<!-- 培训经历 -->
				<div class="train">
					<p
						style="font-size: 26px;font-family: PingFang SC;font-weight: bold;line-height: 37px;color: #333333;">
						培训经历</p>
					<div class="train-content" v-for="(item,index) in trainingList">
						<div style="display: flex;justify-content:space-between;">
							<div>
								<span class="quan"></span>
								<span
									style="font-size: 26px;font-family: PingFang SC;font-weight: 500;line-height: 37px;color: #333333;">{{item.trainschool}}</span>
							</div>
							<div
								style="font-size: 26px;font-family: PingFang TC;font-weight: 400;line-height: 37px;color: #A1A1A1;">
								<span>{{item.entranceTime}}-{{item.graduateTime}}</span></div>
						</div>
						<div
							style="font-size: 24px;font-family: PingFang TC;font-weight: 400;line-height: 33px;color: #A1A1A1;margin: 13px 0 0 35px;">
							{{item.trainingPosts}}</div>
					</div>
				</div>
				<!-- 自我评价 -->
				<div class="evaluation">
					<p
						style="font-size: 26px;font-family: PingFang SC;font-weight: bold;line-height: 37px;color: #333333;">
						自我评价</p>
					<div class="text">
						<p>{{resumeInfo.autognosisEvaluate}}
						</p>
					</div>
				</div>
				<!-- 个人爱好 -->
				<div class="evaluation">
					<p
						style="font-size: 26px;font-family: PingFang SC;font-weight: bold;line-height: 37px;color: #333333;">
						个人爱好</p>
					<div class="text">
						<p>{{resumeInfo.personageHobby}}
						</p>
					</div>
				</div>
			</div>

		</el-dialog>
		<!-- 岗位详情弹框 -->
		<el-dialog title="岗位详情" :visible.sync="Jobdetails" width="1252px" center>
			<div class="content">
				<p>{{Jobdetail.jobName}}</p>
				<div class="miaoshu">
					<div class="content-title">
						<div class="left">
							<div style="display: flex;flex-direction: column;">
								<div><span class="th">薪资:</span><span class="td">{{Jobdetail.salaryPackage}}</span></div>
								<div><span class="th">招聘人数:</span><span class="td">{{Jobdetail.recruitingNumbers}}人</span></div>
								<div><span class="th">年龄范围:</span><span class="td">{{Jobdetail.ageRange}}</span></div>
							</div>
						</div>
						<div class="right">
							<div style="width: 100%;">
								<div><span class="th">学历要求:</span><span class="td">{{Jobdetail.educational}}</span></div>
								<div><span class="th">工作经验:</span><span class="td">{{Jobdetail.workExperience}}</span></div>
								<div><span class="th">发布时间:</span><span class="td">{{Jobdetail.createTime}}</span></div>
							</div>
						</div>
					</div>
					<div>
						<span class="th">任职要求:</span><span class="td">{{Jobdetail.jobRequirements}}</span>
					</div>
					<div>
						<span class="th">工作地址:</span><span class="td">{{Jobdetail.address}}</span>
						<baidu-map class="map" :center="map.content" :zoom='13' :scroll-wheel-zoom='true'>
						</baidu-map>
					</div>
					<div>
						<span class="th">福利待遇:</span>
						<div class="tag-group">
							<el-tag v-for="item in items" :key="item.label" type="danger" effect="plain">
								{{ item.name }}
							</el-tag>
						</div>
					</div>
					<div>
						<span class="th">能力要求:</span>
						<!-- 能力表 -->
						<div style="display: flex;justify-content: space-between;">
							<table width="494px">
								<tr>
									<th class="bold"></th>
									<th class="bold">一般</th>
									<th class="bold">良好</th>
									<th class="bold">优秀</th>
								</tr>
								<tr v-for="(item,index) in abilityDemanded_one">
									<th class="bold">{{item.name}}</th>
									<th>
										<div v-if="item.grade==1" class="nengli">一般</div>
									</th>
									<th>
										<div v-if="item.grade==2" class="nengli">良好</div>
									</th>
									<th>
										<div v-if="item.grade==3" class="nengli">优秀</div>
									</th>
								</tr>
							</table>
							<table width="494px">
								<tr>
									<th class="bold"></th>
									<th class="bold">一般</th>
									<th class="bold">良好</th>
									<th class="bold">优秀</th>
								</tr>
								<tr v-for="(item,index) in abilityDemanded_tow">
									<th class="bold">{{item.name}}</th>
									<th>
										<div v-if="item.grade==1" class="nengli">一般</div>
									</th>
									<th>
										<div v-if="item.grade==2" class="nengli">良好</div>
									</th>
									<th>
										<div v-if="item.grade==3" class="nengli">优秀</div>
									</th>
								</tr>
							</table>
						</div>
					</div>
				</div>
			</div>
		</el-dialog>
	</div>
</template>

<script>
	export default {
		data() {
			return {
				// 鼠、牛、虎、兔、龙、蛇、马、羊、猴、鸡、狗、猪
				animalslist:[{
					label:1,
					name:'鼠'
				},{
					label:2,
					name:'牛'
				},{
					label:3,
					name:'虎'
				},{
					label:4,
					name:'兔'
				},{
					label:5,
					name:'龙'
				},{
					label:6,
					name:'蛇'
				},{
					label:7,
					name:'马'
				},{
					label:8,
					name:'羊'
				},{
					label:9,
					name:'猴'
				},{
					label:10,
					name:'鸡'
				},{
					label:11,
					name:'狗'
				},{
					label:12,
					name:'猪'
				},],
				abilityDemanded_one:[],//能力要求
				abilityDemanded_tow:[],//能力要求
				Jobdetail:{},//岗位详情
				userdata:{},//用户信息
				basicinfo:{},//简历的基本信息
				experienceList:{},//工作经历列表
				intentionList:{},//求职意向列表
				personal:{},//个人情况
				trainingList:{},//培训经历列表
				resumeInfo:{},//简历部分信息
				Jobtitle:[{
					label:1001,
					value:'钟点工'
				},{
					label:1002,
					value:'保姆'
				},{
					label:2001,
					value:'月嫂'
				},{
					label:2002,
					value:'育婴师'
				},{
					label:2003,
					value:'催乳师'
				},{
					label:2004,
					value:'产后康复师'
				},{
					label:2005,
					value:'母乳喂养指导师'
				},{
					label:3001,
					value:'养老护理'
				},{
					label:3002,
					value:'护工'
				}],
				table_data: [{
						one: '餐饮综合',
						tow: 1
					}, {
						one: '餐饮综合',
						tow: 3
					},
					{
						one: '餐饮综合',
						tow: 2
					},
					{
						one: '餐饮综合',
						tow: 1
					},
				],
				map: {
					content: {
						lng: 114.065537,
						lat: 22.553321
					}
				},
				Jobdetails: false, //岗位详情弹框
				title_name: '',
				data: null,
				resshow: false, //简历弹框
				tableData: [],
				items: [],
			}
		},
		created() {
			this.title_name = this.$route.query.name;
			this.data = this.$route.query.data;
			if(this.title_name=='投递人数'){
				this.gettable(this.data,'/house/staffing/selectDeliverPeopleList');
			}else if(this.title_name=='邀约人数'){
				this.gettable(this.data,'/house/staffing/selectInvitePeopleList');
			}else if(this.title_name=='待面试人数'){
				this.gettable(this.data,'/house/staffing/selectInterviewPeopleList');
			}else if(this.title_name=='面试未通过人数'){
				this.gettable(this.data,'/house/staffing/selectFailedInterviewPeopleList');
			}else if(this.title_name=='已录用人数'){
				this.gettable(this.data,'/house/staffing/selectAcceptedPeopleList');
			}
		},
		methods: {
			handle(row, column, event, cell) {
				console.log(column)
				this.userdata=row;
				if (column.label == '会员名称') {
					this.getresume();
				} else if (column.property == "jobName") {
					this.getJobdetails(row);
					this.Jobdetails = true;
				}
			},
			// 得到岗位名称
			getjobname(row){
				row.forEach(e=>{
					this.Jobtitle.forEach(i=>{
						if(e.jobTitle==i.label){
							e.jobName=i.value
						}
					})
				});
			},
			// 获取岗位详情
			getJobdetails(row){
				this.$houseAxios.get('/house/staffing/selectPositionByPositionId',{
					params:{
						positionId:row.positionId
					}
				}).then(res=>{
					console.log(res);
					this.Jobdetail = res.data.data;
					let dataArr = this.Jobdetail.socialBenefits.split(';');
					this.$store.state.welfare.forEach(e=>{
						dataArr.forEach(i=>{
							if(i==e.code){
								this.items.push(e)
							}
						})
					})
					console.log()
					this.$store.state.education.forEach(e=>{
						if(this.Jobdetail.educational==e.code){
							this.Jobdetail.educational=e.name;
						}
					});
					if(!this.Jobdetail.working){
						this.$store.state.salary.forEach(e=>{
							if(this.Jobdetail.salaryPackage==e.label){
								this.Jobdetail.salaryPackage=e.name;
							}
						})
					}else{this.Jobdetail.salaryPackage=this.Jobdetail.salaryPackage + '/小时'}
					this.$store.state.workExperiencePosition.forEach(e=>{
						if(this.Jobdetail.workExperience==e.code){
							this.Jobdetail.workExperience=e.name;
						}
					})
					let arr = this.Jobdetail.abilityDemanded;
					let index = arr.length/2;
					this.abilityDemanded_one = arr.slice(0,index);
					this.abilityDemanded_tow = arr.slice(index);
					
					this.Jobdetail.jobName=row.jobName;
				}).catch(err=>{})
			},
			// 获取用户简历信息
			getresume(){
				this.$houseAxios.get('/house/staffing/selectResume',{
					params:{
						userId:this.userdata.userId
					}
				}).then(res=>{
					this.resumeInfo = res.data.data;
					this.basicinfo = this.resumeInfo.basicinfo;
					this.experienceList = this.resumeInfo.experienceList;
					this.intentionList = this.resumeInfo.intentionList;
					this.personal = this.resumeInfo.personal;
					this.$store.state.education.forEach(e=>{
						if(this.personal.education==e.code){
							this.personal.education=e.name;
						}
					});
					this.animalslist.forEach(e=>{
						if(this.personal.animals==e.label){
							this.personal.animals=e.name;
						}
					});
					this.trainingList = this.resumeInfo.trainingList;
					this.resumeInfo.name = this.userdata.name;
					this.resumeInfo.age = this.userdata.age;
					this.getjobname(this.experienceList);
					this.getjobname(this.intentionList);
					if(this.basicinfo.sex==1){this.basicinfo.sex='男'}else{this.basicinfo.sex='女'};
					if(this.basicinfo.jobStatus==1){this.basicinfo.jobstatus_name="正在找工作"}
					else if(this.basicinfo.jobStatus==2){this.basicinfo.jobstatus_name="在职,正考虑换个新环境"}
					else if(this.basicinfo.jobStatus==3){this.basicinfo.jobstatus_name="在职,暂无跳槽打算"}
					else if(this.basicinfo.jobStatus==4){this.basicinfo.jobstatus_name="在职,有更好的机会也可以考虑"}
					this.resshow = true;
				}).catch(err=>{})
			},
			// 获取列表信息
			gettable(data,url){
				this.$houseAxios.get(url, {
					params:{
						rank:data.rank,
						userId:data.userId,
						pageNum:"",
						pageSize:""
					}
				}).then(res => {
					if(res.data.code==1000){
						this.tableData = res.data.data;
						this.getjobname(this.tableData);
						var date=new Date;
						var year=date.getFullYear();
						this.tableData.forEach(e=>{
							if(e.sex==1){e.Sex='男'}else{e.Sex='女'}
							// e.Age=year-Number(this.e.birthDay.substring(0,4));
							e.age=year-Number(e.birthDay.substring(0,4))
							console.log(e.age)
						})
					}
				}).catch(err=>{})
			},

		}
	}
</script>

<style scoped="scoped">
	/deep/.el-tabs--card>.el-tabs__header {
		border: none;
	}

	/* /deep/.el-tabs__content {
		width: 102rem;
		margin: 2% auto;
		height: 855px;
		background: #FFFFFF;
		border: 1px solid #CCCCCC;
	} */

	/deep/.el-table td {
		text-align: center;
		font-size: 16px;
		font-family: PingFang SC;
		font-weight: 500;
		line-height: 22px;
		color: #000000;
	}

	/deep/.el-tabs__item {
		width: 111px;
		height: 46px;
		border-radius: 5px;
		text-align: center;
		font-size: 21px;
		font-family: PingFang SC;
		font-weight: 400;
		line-height: 40px;
		color: #000000;
		padding-right: 50px;
	}

	/deep/.el-tabs__item.is-active {
		background: #004DD5;
		color: white;
	}

	/deep/.el-tabs--card>.el-tabs__header .el-tabs__item {
		margin-right: 20px;
		border: none;
		width: 242px;
	}

	/deep/.el-table th {
		background-color: #004DD5;
		font-size: 17px;
		font-family: PingFang SC;
		font-weight: 500;
		line-height: 16px;
		text-align: center;
		color: #FFFFFF;
	}

	/deep/.el-table td {
		text-align: center;
		font-size: 13px;
		font-family: PingFang SC;
		font-weight: 500;
		line-height: 22px;
		color: #000000;
	}

	/deep/.el-tabs--card>.el-tabs__header {
		border: none;
	}

	/deep/.el-tabs--card>.el-tabs__header {
		border: none;
	}

	/deep/.el-table td {
		text-align: center;
		font-size: 16px;
		font-family: PingFang SC;
		font-weight: 500;
		line-height: 22px;
		color: #000000;
	}

	/deep/.el-table td:nth-child(1) {
		color: #004DD5;
	}

	/deep/.el-table td:nth-child(8) {
		color: #004DD5;
	}

	/deep/.el-dialog__title {
		font-size: 32px;
		font-family: PingFang SC;
		font-weight: bold;
		line-height: 45px;
		display: inline-block;
	}

	.box {
		width: 102rem;
		height: 100%;
		margin: 2% auto;
	}

	.back {
		width: 77px;
		height: 33px;
		background: #004DD5;
		opacity: 1;
		border-radius: 5px;
		font-size: 17px;
		font-family: PingFang SC;
		font-weight: 500;
		line-height: 28px;
		color: #FFFFFF;
		padding: 4px 5px 0 12px;
	}

	.back>img {
		width: 20px;
		height: 20px;
	}

	.title-name {
		width: 200px;
		height: 46px;
		background: #F8F8F8;
		opacity: 1;
		border-radius: 5px;
		text-align: center;
		font-size: 17px;
		font-family: PingFang SC;
		font-weight: 500;
		line-height: 29px;
		color: #000000;
		margin: 8px 0;
	}

	.content-tab {
		width: 100%;
		height: 882px;
		background: #FFFFFF;
		border: 1px solid #CCCCCC;
	}












	/* 简历 */
	.content>div {
		border-bottom: 1px dashed #707070;
		margin-bottom: 20px;
		padding-bottom: 10px;
	}

	img {
		width: 100%;
		height: 100%;
	}

	.content {
		/* height: 2470px; */
		padding: 30px;
		position: relative;
	}

	.content>.content-title {
		width: 100%;
		height: 330px;
		/* border: 1px dashed #707070; */
		display: flex;
		justify-content: space-between;
	}

	.content>.content-title>div {
		/* border: 1px solid red; */
		height: 100%;
		flex: 1;
		display: flex;
		justify-content: space-between;
	}

	.content>.miaoshu>.content-title {
		width: 100%;
		/* border: 1px dashed #707070; */
		display: flex;
		justify-content: space-between;
	}

	.content>.miaoshu>.content-title>div {
		/* border: 1px solid red; */
		height: 100%;
		flex: 1;
		display: flex;
		justify-content: space-between;
	}

	.content>p {
		font-size: 26px;
		font-family: PingFang SC;
		font-weight: bold;
		line-height: 37px;
		color: #333333;
	}

	.content-center {
		width: 100%;
		height: 285px;
		/* border: 1px dashed #707070; */
		margin-top: 25px;
	}

	.content-center>.tab {
		display: flex;
		justify-content: space-between;
	}

	.content-center>.tab>div {
		display: flex;
		flex-direction: column;
	}

	.experience {
		width: 100%;
		/* border: 1px dashed #707070; */
	}

	.experience-content {
		margin-bottom: 20px;
	}

	.quan {
		margin-right: 20px;
		display: inline-block;
		width: 11px;
		height: 11px;
		border: 1px solid #E91E14;
		border-radius: 50%;
		opacity: 0.8;
	}

	.train {
		width: 100%;
	}

	.train-content {
		width: 100%;
		display: flex;
		flex-direction: column;
		margin-bottom: 20px;
	}

	.evaluation {
		width: 100%;
	}

	.evaluation>.text {
		width: 1106px;
		font-size: 24px;
		font-family: PingFang TC;
		font-weight: 400;
		line-height: 33px;
		color: #333333;
	}

	.th {
		font-size: 25px;
		font-family: PingFang TC;
		font-weight: 400;
		line-height: 50px;
		color: #999999;
	}

	.td {
		font-size: 25px;
		font-family: PingFang TC;
		font-weight: 400;
		line-height: 50px;
		color: #333333;
	}

	.map {
		width: 825px;
		height: 233px;
	}

	/deep/.el-tag--plain.el-tag {
		width: 117px;
		height: 43px;
		border: 1px solid #FE3B2D;
		opacity: 1;
		border-radius: 5px;
		font-size: 19px;
		font-family: PingFang SC;
		font-weight: 400;
		line-height: 36px;
		color: #FE3B2D;
		text-align: center;
		margin-right: 30px;
	}

	.bold {
		font-size: 19px;
		font-family: PingFang SC;
		font-weight: bold;
		line-height: 40px;
		color: #000000;
	}

	table {
		background: #F5F5F5;
		border-radius: 8px;
	}

	.nengli {
		width: 54px;
		height: 21px;
		border: 1px solid #FFFFFF;
		background: linear-gradient(132deg, #FFDDDD 0%, #FF3E3E 100%);
		font-size: 11px;
		font-family: PingFang SC;
		font-weight: 400;
		line-height: 16px;
		color: #FFFFFF;
		border-radius: 10px;
		display: inline-block;
		margin: 0 auto;
	}
	.item{
		display: inline-block;
		width: 380px;
	}
	.header-title{
		font-size: 27px;
		margin-left: 10px;
		line-height: 60px;
	}
</style>
